<!-- 
    Emmet语法
        前身是Zen Coding，利用【缩写】可提高html、css的编写速度，
        vscode内部集成了该语法。

        1）快速生成HTML
            ! tab               生成HTML5模板
            标签 tab             生成标签
            标签*数量 tab        生成多个标签
            标签>标签            父子标签
            标签+标签            兄弟标签
            .类名 或 标签.类名    带类名的标签
            #ID名 或 标签#ID名    带ID的标签
            {内容}               带内容
            标签.类名$*5{内容$}   自增$
            标签.类名${内容$}*5   自增$
        案例
            ul>li*5
            ul#test>li*3{测试$}
            ul#test>li.demo$*3{测试$}

        2）快速生成CSS：简写即可
            w200 tab    width: 200px;
            lh26 tab    line-height: 26px;
            tac tab     text-align: center;
            tdn tab     text-decoration: none;


    拓展
        ZenCoding  https://baike.baidu.com/item/Zen%20Coding/10219092
    
        按tab不能让emmet生效时，设置--》搜索【Emmet:Trigger Expansion On Tab】，勾上即可
-->
<style>
  div {
    color: red;
  }
</style>

<ul>
  <li class="test1">测试1</li>
  <li class="test2">测试2</li>
  <li class="test3">测试3</li>
</ul>
